<!-- subpkg_consult/description/index.vue -->
<script lang="ts" setup>
  import { uploadImageApi } from '@/apis/consult'
  import { useConsultStore } from '@/stores/consult'
  import { request } from '@/utils/http'
  import { ref } from 'vue'

  const illnessInfo = ref<{
    illnessDesc: string
    illnessTime: number
    consultFlag: number
    pictures: { id: string; url: string }[]
  }>({
    illnessDesc: '',
    illnessTime: 1,
    consultFlag: 0,
    pictures: [],
  })
  // 患病时长
  const illnessTimes = [
    { value: 1, text: '一周内' },
    { value: 2, text: '一月内' },
    { value: 3, text: '半年内' },
    { value: 4, text: '半年以上' },
  ]
  const currnetindex = (value: number) => {
    illnessInfo.value.illnessTime = value
  }
  // 是否就诊过
  const consultFlags = [
    { value: 1, text: '就诊过' },
    { value: 0, text: '没有就诊过' },
  ]
  const onFlagTagClick = (value: number) => {
    illnessInfo.value.consultFlag = value
  }
  const onSelect = async (e: any) => {
    console.log(e)
    const image = e.tempFilePaths[0]
    // await uploadImageApi(image)
    const res = await request.upload<null, { id: string; url: string }>('/upload', {
      name: 'file',
      filePath: image,
    })
    console.log(res)
    illnessInfo.value.pictures.push(res)
  }
  const store = useConsultStore()
  const props = defineProps<{ type: string; illnessType: string; depId: string }>()
  //下一步
  const nextStep = () => {
    store.upateIllnessInfo(illnessInfo.value) //4
    store.setType(props.type) //1
    store.setIllnessType(props.illnessType) //1
    store.setDepId(props.depId) //1
    uni.navigateTo({ url: '/subpkg_archive/list/index?type=consult' }) //进入档案页
  }
  if (store.illnessInfo.illnessDesc) {
    const res = uni
      .showModal({
        title: '温馨提示',
        content: '是否恢复数据',
        cancelColor: '#000000',
        cancelText: '取消',
        confirmColor: '#999999',
        confirmText: '确定',
        showCancel: true,
      })
      .then((res) => {
        if (res.confirm) {
          illnessInfo.value = store.illnessInfo
        }
      })
  }
</script>

<template>
  <scroll-view>
    <view class="description-page">
      <!-- 在线医生 -->
      <view class="doctor-online">
        <image src="/static/uploads/doctor-avatar-2.png" class="doctor-avatar" />
        <view class="doctor-info">
          <view class="name">在线医生</view>
          <view class="message">
            请描述你的疾病或症状、是否用药、就诊经历，需要我听过什么样的帮助
          </view>
          <view class="tips">
            <text class="iconfont icon-shield"></text>
            内容仅医生可见
          </view>
        </view>
      </view>
      <!-- 患者信息 -->
      <view class="patient-info">
        <view class="description">
          <uni-easyinput
            v-model="illnessInfo.illnessDesc"
            type="textarea"
            :input-border="false"
            placeholder-style="font-size: 30rpx; color: #979797"
            placeholder="请详细描述您的病情,病情描述不能为空"
          />
        </view>

        <view class="title">本次患病多久了？</view>
        <view class="tags">
          <text
            v-for="(item, index) in illnessTimes"
            :key="item.value"
            class="tag"
            @click="currnetindex(item.value)"
            :class="{ active: item.value === illnessInfo.illnessTime }"
            >{{ item.text }}</text
          >
        </view>

        <view class="title">此次病情是否去医院就诊过？</view>
        <view class="tags">
          <text
            v-for="(item, index) in consultFlags"
            :key="item.value"
            class="tag"
            @click="onFlagTagClick(item.value)"
            :class="{ active: item.value === illnessInfo.consultFlag }"
            >{{ item.text }}</text
          >
        </view>
      </view>
      <!-- 上传图片 -->
      <view class="patient-picture">
        <uni-file-picker
          v-model="illnessInfo.pictures"
          title="上传病情相关图片 (仅医生可见)"
          @select="onSelect"
          :auto-upload="false"
          limit="8"
          :image-styles="{ width: '160rpx', height: '160rpx' }"
          file-extname="png,jpg,gif,webp"
        />
      </view>
    </view>
    <!-- 下一步操作 -->
    <view class="next-step">
      <button @click="nextStep" :disabled="illnessInfo.illnessDesc === ''" class="uni-button">
        下一步
      </button>
    </view>
  </scroll-view>
</template>

<style lang="scss">
  @import './index.scss';
</style>
